<!DOCTYPE html>
<html>
<head>
	<title>vue实例</title>
	<meta charset="utf-8">
	<script type="text/javascript" src="./js/vue.js"></script>
	<style type="text/css">
		.one {
			color:red;
		}
	</style>
</head>
<body>
	<div id="app">

		<!-- <div v-on:click="handle" v-bind:class="{active:isactive}">
			hello world
			
		</div> -->


		<!-- <div v-on:click="handle" v-bind:class="[active, active1]">
			hello world
			
		</div> -->


		<div v-on:click="handle" v-bind:style="styleObj">  <!-- style里面也可以是个数组 -->
			hello world
			
		</div>

		
	
	</div>

</body>
<script type="text/javascript">

	var vm = new Vue({
		el:"#app",
		data:{
			styleObj:{
				color:"red"
			}
		},
		methods:{
			handle:function() {
				this.styleObj.color = this.styleObj.color=="black" ? "red" : "black";
			}
		}
		

	})



		
</script>
</html>